<template>
	<view>
		<view class="content-form">
			<u-form :label-style="labelStyle" label-width="200">
				<u-form-item label="带看方式" right-icon="arrow-right">
					<u-input :value="typeText[index]" @click="chooseType" disabled/>
				</u-form-item>
				<u-form-item label="联系方式">
					<u-input placeholder="请输入联系方式" v-model="phone"/>
				</u-form-item>
				<u-form-item label="带看时间">
					<u-input placeholder="请选择带看时间" disabled v-model="looktime" @click="show = !0"/>
				</u-form-item>
				<u-form-item label="微信/QQ">
					<u-input  placeholder="可选填" v-model="wxqq"/>
				</u-form-item>
				<view class="tips u-flex">
					<image src="@/static/icon/tips.png"></image>
					<text>提示：如有不方便电话沟通的可以微信或QQ联系</text>
				</view>
			</u-form>
			<view class="submit-btn">
				<u-button shape="circle" type="primary" @click="submit">提交</u-button>
			</view>
		</view>
		
		<u-picker v-model="show" mode="time" @confirm="dateTime"></u-picker>
		
		<!-- 底部安全区适配 -->
		<view class="safe-area-inset-bottom"></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				labelStyle:{color:'#111',fontWeight:'bold',fontSize:'30rpx'},
				typeText:['线上带看','线下带看'],
				index:0,
				phone:'',
				looktime:'',
				wxqq:'',
				show:!1,
				data:''
			}
		},
		methods: {
			submit(){
				if(!this.phone){this.$u.toast('请输入联系方式');return}
				if(!this.looktime){this.$u.toast('请选择带看时间');return}
				
				this.$u.post('/api/user/appointmentLook',{
					build_type:this.data.build_type,
					house_id:this.data.did,
					
					mode:this.index + 1,
					phone:this.phone,
					wxqq:this.wxqq,
					looktime:this.looktime,
					admin_housekeeper_id:this.data.id
				}).then(res=>{
					this.$app.jump('/pages/house/more/daikan-submit-1',!0)
				})
			},
			chooseType(){
				uni.showActionSheet({
					itemList:this.typeText,
					success:res=>{
						this.index = res.tapIndex
					}
				})
			},
			dateTime(e){
				console.log(e)
				this.looktime = `${e.year}-${e.month}-${e.day}`
			}
		},
		onLoad({data}) {
			this.data = JSON.parse(decodeURIComponent(data))
		}
	}
</script>

<style lang="scss">
	.content-form{
		padding: 20rpx 42rpx;overflow: hidden;
		.page-title{font-size: 36rpx;font-weight: bold;padding: 10rpx 0;}
		.right-text{font-weight: bold;color: #333;}
	}
	/deep/.u-form-item.u-border-bottom{border-bottom: 1rpx solid #ddd;padding: 18rpx 0!important;
		&::after{display: none;}
	}
	.check-box{position: relative;padding: 10rpx 0;
		&::before{content: '';display: block;position: absolute;box-sizing: border-box;border: 10rpx solid #f4f4f4;width: 200%;height: 100%;left: 50%;transform: translateX(-50%);top: 0;z-index: -1;}
	}

	.tips{
		padding: 10rpx 0 50rpx;
		image{width: 24rpx;height: 24rpx;display: block;padding-right: 15rpx;}
		text{font-size: 24rpx;color: #666;}
	}
	
	.submit-btn{
		padding-top: 180rpx;
	}
</style>
